<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
<meta content="yes" name="apple-mobile-web-app-capable" />
<meta content="black" name="apple-mobile-web-app-status-bar-style" />
<meta content="telephone=no" name="format-detection" />
<meta content="email=no" name="format-detection" />
<title>工单列表</title>



<link rel="stylesheet" href="../../css/s_plus.css" />
<link rel="stylesheet" href="../../css/base.css?time=233" />
<link rel="stylesheet" href="../../css/layout.css" />
<link rel="stylesheet" href="../../css/choice.css" />
<script type="text/javascript" src="../../libs/vue.js" ></script>
<script type="text/javascript" src="../../js/jquery.1.9.1.min.js" ></script>
<script type="text/javascript" src="../../js/app/url.js" ></script>
<script type="text/javascript" src="../../libs/hui.js" ></script>
<script type="text/javascript" src="../../js/s_plus.js" ></script>
<script type="text/javascript" src="../../js/md5.js"></script>
<script type="text/javascript" src="../../js/app/api.js"></script>
<script type="text/javascript" src="../../js/control/mescroll/mescroll.min.js"></script>
<link rel="stylesheet" href="../../js/control/mescroll/mescroll.min.css?time=1201922"  charset="UTF-8"/>
<!--<script type="text/javascript" src="menu.js"></script>-->

<style>

 .mescroll {
 	position: fixed;
 	top: 60px;
 	bottom: 0;
 	height: auto;
 }
			
</style>
</head>
<body >



<section class="add_btn"> <a class="minor_btn" id="addBtn"><i class="iconfont">&#xe626;</i></a></section>


<section id="wrapper" class="wrapper">
  <section class="pusher">
	<section class="sidenav sidebtn"><!--侧边栏-->
	</section>

	
	<section class="mainbody" id="app"><!--正文-->
      <header class="f_l maxbox header">
        <a class="side_arrow f_l arrow_l" data-effect="sidebtn"><i class="iconfont">&#xe600;</i></a>
        <h1 class="f_l">
          <a @click="gisMap">
            <i class="iconfont">&#xe608;</i>
            <b>GIS地图</b>
          </a>
          <a class="cur">
            <i class="iconfont">&#xe61f;</i>
            <b>工单</b>
          </a>
        </h1>
        <!--<a class="f_r arrow_r" href="javascript:void(0);"><i class="iconfont">&#xe888;</i></a>
        <ul class="head_nav">
          <li><a href="">告警</a></li>
          <li><a href="">施工</a></li>
          <li><a href="">正常</a></li>
        </ul>-->
      </header>
      
   <div id="myscroll" class="mescroll">   
    <div>
      <section class="f_l maxbox work_list">
        <dl v-for="item in lists">
                	<a @click="detail(item.ID)">

            <dt>
              <i class="iconfont bg_red">&#xe60f;</i>
              <b v-text="item.ALARM_TITLE"></b>
            </dt>
            <dd class="txt_list">
              <p><em>告警类别：</em>{{showType(item.ALARM_TYPE)}}</p>
              <p><em>设备编号：</em>{{item.ZD_ID}}</p>
              <p><em>形成时间：</em>{{geshi(item.CREATE_DATE)}}</p>
            </dd>
            <div class="sig bg_red">{{showStatus(item.WORK_STATE)}}</div>
      
            </a>
        </dl>
	</section>
	</div>
</div>
  </section>
</section>
  </section>


  <script>
  


  	
	//动态插入公用菜单JS
	var menuJsPath = "../work/menu.js?time=";
	 var randomh=Math.random();
     var e = document.getElementsByTagName("script")[0];
     var d = document.createElement("script");
     d.src = menuJsPath+randomh+"";
     d.type = "text/javascript"; 
     d.async = true;
     d.defer = true;
     e.parentNode.insertBefore(d,e);

  	var path = urlManager.worklist();
  	var username=	localStorage.getItem("username");
	var sec= localStorage.getItem("sec_pwd");
  	var time = getNow();
  	var key = "loginName="+username+"&passWord="+sec+"&time="+time;
  	
  	var paramKey=hex_md5(key);
  	var jsonParam = JSON.stringify({loginName:username,time:time,key:paramKey});
  	console.log(jsonParam);


$("#addBtn").click(function(){
	  sp.addWork();
});

    	var sp = new Vue({
				el:"#app",
				data:{
					username:"",
					keep:[],
					lists:[]
			
				},
					methods:{
						geshi:function(param){
							 return formatTime(param);
						},
						
						addWork:function(){
							hui.open("work_add.html?time"+apiManage.getNow(), {}, true, {});	
						},
						detail:function(pid){
							console.log(pid);
							localStorage.setItem("workid",pid);
														localStorage.setItem("type","");

							hui.open("work_show.html?time="+apiManage.getNow(), {}, true, {});	

							
						},
						logout:function(){
							console.log('2222222');
							hui.open("../../login.html", {}, true, {});	
						},
						showType:function(param){
							if(param=='1'){
								return "一般告警";
							}
							else{
								return "严重告警";

							}
						},
						showStatus:function(param){
							var text= "";
//10	新建	work_state	
//20	待指派	work_state	
//30	待接收	work_state	
//40	待处理	work_state	
//50	进一步处理	work_state	
//60	已完成	work_state	
//90	已取消
							if(param =='10'){
								text='新建';
							}
							else if(param =='20'){
								text='待指派';
							}
							else if(param =='30'){
								text='待接收';
							}
							else if(param =='40'){
								text='待处理';
							}
							else if(param =='50'){
								text='进一步处理';
							}
							else if(param =='60'){
								text='进已完成';
							}
							else{
								text='已取消';
							}
							
							return text;

						},
						gisMap:function(){
							hui.open("work_index.html?time="+apiManage.getNow(), {}, true, {});

						}
					}
					,
		mounted: function() {
			
			//创建MeScroll对象,down可以不用配置,因为内部已默认开启下拉刷新,重置列表数据为第一页
			//解析: 下拉回调默认调用mescroll.resetUpScroll(); 而resetUpScroll会将page.num=1,再执行up.callback,从而实现刷新列表数据为第一页;
			var self = this;
			self.mescroll = new MeScroll("myscroll", { //请至少在vue的mounted生命周期初始化mescroll,以确保您配置的id能够被找到
				up: {
					auto : true,
					callback: refreshData,
					isBounce: false,
					empty: {
						warpId: "no_data",							
						tip: "-------暂无数据-------"
					},
				}
			});



		}
				});
				
				
				function refreshData(page){
					
					console.log("params---"+JSON.stringify({pageNo:page.num,pageSize:10}));
						$.ajax({
		         type: "GET",
		         url: path,
		         data:{pageNo:page.num,pageSize:10},
		         beforeSend: function(request) {
		            request.setRequestHeader("loginName",username);
		            request.setRequestHeader("time",time);
		            request.setRequestHeader("sign",paramKey);
		            request.setRequestHeader("Content-Type","application/text");
		
		         },
		         success: function(result) {
		             console.log("工单列表:"+JSON.stringify(result));
		          		 var datas=result.list;
		
		              if(datas != null) {
//		              	page.num++;
							//如果是第一页需手动制空列表 (代替clearId和clearEmptyId的配置)
							if(page.num == 1) {sp.lists = []};
			
							//更新列表数据
							sp.lists = sp.lists.concat(datas);
										
							if(sp.lists.length<10){
					            sp.mescroll.endSuccess(sp.lists.length, false);
							}
							else{
					            sp.mescroll.endSuccess(sp.lists.length, true);
			
							}
			
							//sp.mescroll.endBySize(sp.lists.length,dataJson.bodyData.totalItems); //必传参数(当前页的数据个数, 总数据量)
						} else{
							sp.lists = null;
							sp.mescroll.endErr();
						}				 
		             
		         }
		     });
					

	}	


 
	        Date.prototype.format = function (format) //author: meizz
	    {
	        var o = {
	            "M+": this.getMonth() + 1, //month
	            "d+": this.getDate(),    //day
	            "h+": this.getHours(),   //hour
	            "m+": this.getMinutes(), //minute
	            "s+": this.getSeconds(), //second
	            "q+": Math.floor((this.getMonth() + 3) / 3),  //quarter
	            "S": this.getMilliseconds() //millisecond
	        }
	        if (/(y+)/.test(format)) format = format.replace(RegExp.$1,
	        (this.getFullYear() + "").substr(4 - RegExp.$1.length));
	        for (var k in o) if (new RegExp("(" + k + ")").test(format))
	            format = format.replace(RegExp.$1,
	          RegExp.$1.length == 1 ? o[k] :
	            ("00" + o[k]).substr(("" + o[k]).length));
	        return format;
	    }

	    function formatTime(val) {
	    	if(val==null||val==''){
	    		return "";
	    	}
	        var re = /-?\d+/;
	        var m = re.exec(val);
//	         m = m.replace(/\-/g, "/");
	        var d = new Date(parseInt(m[0]));
	        
	       
	        // 按【2012-02-13 09:09:09】的格式返回日期
//	        var tmp  = d.format("yyyy-MM-dd hh:mm:ss");
//	        console.log("格式化时间:   "+tmp);
	        return d.format("yyyy-MM-dd hh:mm:ss");
	    }


  
  	//获取当前时间戳
				function getNow () {
					var timestamp=new Date().getTime();
					return timestamp;
				}
				
  
  	
  </script>
</body>
</html>
<!--侧边栏向左移动效果*该放在head无效-->
<script src="../../js/modernizr.custom.js"></script>
<script src="../../js/classie.js"></script>
<script src="../../js/sidebarEffects.js"></script>